<%@ page language="java" contentType="text/html; charset=utf-8"  pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<c:set var="contextPath" value="${pageContext.request.contextPath}" scope="request"/>
<nav class="navbar-default navbar-static-side" role="navigation">
    <div class="sidebar-collapse">
        <ul class="nav metismenu" id="side-menu">
            <li class="nav-header">
                <div class="dropdown profile-element">
					<img src="${contextPath}${sitePicPath}/${mgmtInfo.icon}" style="max-width:60px">
                	
	                <a data-toggle="dropdown" class="dropdown-toggle" href="#">
	                <span class="clear"> <span class="block m-t-xs"> <strong class="font-bold">${CSCMS_USERSESSION.operator.name}</strong>
	                 </span> <span class="text-muted text-xs block">状态 <b class="caret"></b></span> </span> </a>
	                <ul class="dropdown-menu animated fadeInRight m-t-xs">
	                    <li><a href="login.action">退出</a></li>
	                </ul>
                </div>
                <div class="logo-element">
				<img src="${contextPath}${sitePicPath}/${mgmtInfo.icon}" style="max-width:60px">
                <br/>${mgmtInfo.subTitle}
                </div>
            </li>
            <c:set var="items" value="${CSCMS_USERSESSION.menuTree.rootNodes[0].children}" ></c:set>
            <c:forEach items="${items}" var="node" >
            	<li>
            		<c:if test="${node.entry.leaf}">
              		<a id="menu_item_${node.id}" url="${contextPath}${node.link}" class="menuItem"  href="javascript:void(0);">
            			<i class="${empty node.entry.icon?'fa-th-large':node.entry.icon}"></i><span class="nav-label">${node.title}</span>${fn:length(node.children) gt 0 ?'<span class="fa arrow"></span>':'' }
            		</a>
            		</c:if>
            		<c:if test="${not node.entry.leaf}">
            			<a href="javascript:void(0);">
            				<i class="${empty node.entry.icon?'fa-th-large':node.entry.icon}"></i><span class="nav-label">${node.title}</span>${fn:length(node.children) gt 0 ?'<span class="fa arrow"></span>':'' }
            			</a>
            		</c:if>
            		<c:if test="${fn:length(node.children) gt 0 }">
             		<ul class="nav nav-second-level">
             			<c:forEach items="${node.children }" var="sNode">		
             				<c:if test="${not empty sNode.path}">
              				<li ${fn:endsWith(accessPath,sNode.link) ?'class="active"':'' }>
              					<a id="menu_item_${sNode.id}" url="${contextPath}${sNode.link}" class="menuItem" href="javascript:void(0);">${sNode.title }</a>
              				</li>
             				</c:if>             		
             			</c:forEach>
             		</ul>
             	</c:if>
            	</li>
            </c:forEach>
        </ul>
    </div>
</nav>

<script type="text/javascript">
	function tiggerMenu(id){
	 	$("#"+id).trigger("click");
	}

	function autoLocateNavItem(id){
		$("#side-menu li").removeClass('active');
        $("#side-menu ul").removeClass('in');
        if(id){
			var navItem = $('#side-menu #'+id.replace('tab_tab_',''));
			if(navItem){
				navItem.closest('li').addClass('active');
		    	var secondLevel = navItem.closest('ul .nav-second-level');
		    	if(secondLevel[0]){
		    		secondLevel.addClass('in');
		        	$(secondLevel).closest('li').addClass('active');
		        }
			}	        
        }
	}

    $(document).ready( function(){
        $('.menuItem').click(function () {
        	addTabs($(this).attr('id')
                	,$(this).attr('title') ? $(this).attr('title') : $(this).html()
                    ,$(this).attr('url'));
        });

        tiggerMenu('menu_item_${mgmtInfo.defaultNav}');
    }); 
</script>